import PropTypes from 'prop-types'
import {Page} from 'components'
import CustomGrid from "./DynamicPanel/CustomGrid";
import ModalWrapper from "../../../components/ModalWrapper/ModalWrapper";
import React from "react";
import {setActionHandlersForModal, setContextForAGGrid} from "./utils/TemplateUtils";


const FlowIndexTemplate = ({
                 flowConfigProps, loading, location
               }) => {
  const {gridOptions, modalOptions, gridActionOptions, panelOptions} = flowConfigProps

  const { modalContent, modalProperties, actionOptions : modalActionOptions} = modalOptions

  setActionHandlersForModal(modalProperties, modalActionOptions.hideModal)

  setContextForAGGrid(gridOptions,  gridActionOptions.menuClickHandler)

  return (
    <Page inner className="grid-wrapper">
      <CustomGrid gridOptions={gridOptions} panelOptions={panelOptions} className="grid-content"/>
      <ModalWrapper modalProperties={modalProperties}>
        <div className="modal_content_wrapper">
          {modalContent}
        </div>
      </ModalWrapper>
    </Page>

  )
}

FlowIndexTemplate.propTypes = {
  flowConfigProps: PropTypes.object.isRequired,
  loading: PropTypes.object,
  location: PropTypes.object,
  dispatch: PropTypes.func.isRequired,
}

export default FlowIndexTemplate



